<template>
	<div class="index__partBox__src-home-zoneAll-">
		<div class="index__pagesContainer__src-home-zoneAll-" id="scrollZoneAll">
			<router-link class="index__tab__src-home-zoneAll-tab- " to="/">
				<p>首页</p>
			</router-link>
			<router-link class="index__tab__src-home-zoneAll-tab-" v-for="(item,index) in list" v-if="item.typename.split('').length<=2" :key="item.tid" :to="{name:'channel',params:{tid:item.tid}}">
				<p>{{item.typename}}</p>
			</router-link>
			<router-link v-else class="index__tab__src-home-zoneAll-tab- index__big__src-home-zoneAll-tab- " :key="item.tid" :to="{name:'channel',params:{tid:item.tid}}">
				<p>{{item.typename}}</p>
			</router-link>
			<a class="index__tab__src-home-zoneAll-tab- " href="//live.bilibili.com/h5/">
				<p>直播</p>
			</a>
			<a class="index__tab__src-home-zoneAll-tab- " href="//h.bilibili.com/ywh/h5/home">
				<p>相簿</p>
			</a>
		</div>
		<div class="index__switchContainer__src-home-zoneAll-">
			<svg class="index__icon__src-home-zoneAll-" aria-hidden="true">
				<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-shouqixiao"></use>
			</svg>
		</div>
	</div>
</template>

<script>
	import config from "@/config";
	import axios from "axios";
	export default{
		name: 'bnav2',
		mounted(){
			this.list=window.__INITIAL_STATE__.reduxAsyncConnect.partitionList[0]
			this.$nextTick(function(){
				this._getnav2()
			})
		},
		data(){
			return {
				list:[]
			}
		},
		methods:{
			_getnav2(){
				var svg1=document.querySelector(".index__icon__src-home-zone-");
				var svg2=document.querySelector(".index__icon__src-home-zoneAll-");
				var nav=document.querySelector(".index__partBox__src-home-zoneAll-");
				svg1.addEventListener("click",()=>{
					nav.classList.add("index__show__src-home-zoneAll-");
				})
				svg2.addEventListener("click",()=>{
					nav.classList.remove("index__show__src-home-zoneAll-");
				})
			}
		}
	}
</script>

<style lang="scss">
	/*.router-link-exact-active p{
	    width: 1.36533rem;
	    font-size: .59733rem;
	    line-height: 1.28rem;
	    text-align: center;
	    color: #fb7299;
	    border-bottom: .08533rem solid #fb7299;
	}*/
</style>